<template>
	<div>
		<div class="box">
			<div class="title">
				<span class="tag"></span>
				替车
			</div>
			<div class="">
				<FormItems
					ref="form"
					v-model="formData"
					:form="formList.list1"
					:state="state"
					labelWidth="140px"></FormItems>
				<FormItems
					ref="form"
					v-model="formData"
					:form="formList.list2"
					:state="state"
					labelWidth="140px"></FormItems>
				<!-- <FormItems -->
				<!-- ref="form" -->
				<!-- v-model="formData" -->
				<!-- :form="formList.list3" -->
				<!-- :state="state" -->
				<!-- labelWidth="140px"></FormItems> -->
			</div>
		</div>
	</div>
</template>

<script>
	import FormItems from '@/views/finance/manage/formItems/index.vue';
	import FormItem from '@/views/finance/reimburs/formItem/index.vue';
	export default {
		components: { FormItems, FormItem },
		props: {
			value: {
				required: false,
			},
			state: {
				required: false,
			},
			type: {
				type: String,
				required: false,
			},
		},
		dicts: [
			'quota_substitute_control_level',
			'quota_substitute_routine_level',
		],
		data() {
			return {};
		},
		inject: ['_planDicts', 'details_config', 'details_forecast', '_index'],
		computed: {
			details() {
				return this.details_forecast();
			},
			index() {
				return this._index();
			},
			config() {
				return this.details_config();
			},
			formData: {
				get() {
					return this.useVModel.call(this);
				},
				set(val) {
					this.$emit('input', val);
				},
			},
			planList() {
				return this._planDicts?.() ?? [];
			},
			formList() {
				return {
					list1: [
						{
							label: '常规替车',
							type: 'select',
							selectList: [
								{
									label: '是',
									value: '1',
								},
								{
									label: '否',
									value: '2',
								},
							],
							prop: 'substituteMaintenanceLevel',
							rules: true,
						},
						{
							label: '维保替代车级别',
							placeholder: '请选择维保替代车级别',
							type: 'select',
							selectList: this.planList.levelList,
							selectLabel: 'level',
							selectValue: 'id',
							prop: 'substituteMaintenanceLevelType',
							show:
								this.formData.substituteMaintenanceLevel == '1',
							rules: true,
						},
						{
							label: '维保替代车价格（月）',
							placeholder: '请输入金额',
							type: 'input_number',
							prop: 'substituteMaintenanceRent',
							show:
								this.formData.substituteMaintenanceLevel == '1',
							tag: 'price',
							state:
								this.type == 'preview'
									? 'readonly'
									: this.config?.quotationProductSchemeRule
											?.openReplacementFeeModification ==
									  1
									? 'write'
									: 'disabled',
							event: {
								type: 'change',
								cb: row => {
									if (
										this.notEmpty(
											row.substituteMaintenanceRent,
										)
									) {
										this.formData.planConf.substituteMaintenanceRent_state =
											'changed';
									} else {
										this.formData.planConf.substituteMaintenanceRent_state =
											'';
									}
								},
							},
						},
					],
					list2: [
						{
							label: '限行替代车',
							placeholder: '请选择维保替代车级别',
							type: 'select',
							selectList:
								this.dict.type.quota_substitute_control_level,
							prop: 'substituteControlLevelType',
							rules: true,
						},
						{
							label: '限行替代车价格（月）',
							placeholder: '请输入金额',
							type: 'input_number',
							prop: 'substituteControlRent',
							state:
								this.type == 'preview'
									? 'readonly'
									: 'disabled',
							tag: 'price',
							state:
								this.type == 'preview'
									? 'readonly'
									: this.config?.quotationProductSchemeRule
											?.openReplacementFeeModification ==
									  1
									? 'write'
									: 'disabled',
							event: {
								type: 'change',
								cb: row => {
									if (
										this.notEmpty(row.substituteControlRent)
									) {
										this.formData.planConf.substituteControlRent_state =
											'changed';
									} else {
										this.formData.planConf.substituteControlRent_state =
											'';
									}
								},
							},
						},
					],
					list3: [
						{
							label: '事故替车',
							type: 'select',
							selectList:
								this.dict.type.quota_substitute_routine_level,
							prop: 'substituteRoutineLevelType',
						},
					],
				};
			},
		},
		created() {
			if (this.Empty(this.formData?.substituteControlLevelType)) {
				this.$set(this.formData, 'substituteControlLevelType', '2');
			}
		},
		beforeDestroy() {
			if (this.notEmpty(this.details?.productList?.[this.index])) {
				this.$refs.form?.form_resetFields?.();
				this.formData.substituteMaintenanceLevel = '2';
				this.formData.substituteControlLevelType = '2';
			}
		},
		mounted() {},
		methods: {
			valid() {
				return new Promise(async resolve => {
					let result = true;
					let refs = Object.values(this.$refs);
					for (let index = 0; index < refs?.length; index++) {
						const ref = refs[index];
						if (
							Object.prototype.toString.call(ref) ==
							'[object Array]'
						) {
							for (let i = 0; i < ref.length; i++) {
								const element = ref[i];
								if (element?.valid) {
									let rc = await element?.valid?.();
									result = result && rc;
								}
								if (element?.validate) {
									let rf = await this._valid(ref);
									result = result && rf;
								}
								if (element?.form_validate) {
									let rf = await this._valid(
										ref,
										'form_validate',
									);
									result = result && rf;
								}
							}
						} else {
							if (ref?.valid) {
								let rc = await ref?.valid?.();
								result = result && rc;
							}
							if (ref?.validate) {
								let rf = await this._valid(ref);
								result = result && rf;
							}
							if (ref?.form_validate) {
								let rf = await this._valid(
									ref,
									'form_validate',
								);
								result = result && rf;
							}
						}
					}

					resolve(result);
				});
			},
		},
	};
</script>

<style lang="scss" scoped>
	.box {
		border-radius: 8px;
		background-color: #fff;
		.title {
			font-size: 14px;
			font-family: PingFangSC, PingFang SC;
			font-weight: 500;
			color: #333333;
			line-height: 22px;
			padding: 15px 0;
			// border-bottom: 1px solid #e9e9e9;
			display: flex;
			align-items: center;
			.tag {
				width: 8px;
				height: 8px;
				background-color: #1890ff;
				border-radius: 100%;
				margin-right: 10px;
			}
		}
	}
</style>
